<template id="adress">
    <div>
        <div class="add_p">
            <p><img src="../image/dayu.jpg" alt="" @click="getAdress()">新增收货地址</p>
            <p><span>收货人</span><input type="text"></p>
            <p><span>收货人手机</span><input type="text"></p>
            <p><span>所在地区</span><span></span><img src="../image/day.jpg" alt=""></p>
            <p><span>详情地址</span><input type="text"></p>
            <p><span class="s_l">类型<span>(选填)</span></span><span class="s_l1"><time></time>家&nbsp;&nbsp;&nbsp; <time></time>公司</span> </p>
        </div>
        <div class="a_click">
              <button>保存并使用</button>
        </div>
    </div>
</template>
<script>
    /*测试订单详情使用*/
    export default {
        name:'adress',
        components:{
            /*'v-details':details,
            'v-order':Orderdetails*/
        },
        methods:{
            getAdress:function(){
                window.history.go(-1);
            }
        }
    }
</script>
<style>
    .a_click{
        height:6.67rem;
        width:100%;
    }
    .a_click button{
        display:block;
        height:0.84rem;
        width:5.71rem;
        background:#ff7f00;
        color:#ffffff;
        line-height:0.84rem;
        text-align:center;
        outline: none;
        border:0;
        margin:0.6rem 0.35rem 0 0.35rem;
        font-size:0.3rem;
    }
    .add_p{
        height:3.6rem;
        width:100%;
    }
    .add_p p:nth-of-type(6){
        height:0.6rem;
        width:100%;
        display:flex;
        flex-direction: row;
    }
    .add_p p:nth-of-type(6) .s_l{
        width:2.33rem;
        display:block;
        height:0.6rem;
        line-height:0.6rem;
        color:#3d3d3d;
        font-size:0.2rem;
        text-indent: 0.3rem;
    }
    .add_p p:nth-of-type(6) .s_l1{
        display:block;
        height:0.6rem;
        width:4.07rem;
        font-size:0.18rem;
        line-height:0.6rem;
        position:relative;
        margin-left:0.5rem;
    }
    .add_p p:nth-of-type(6) .s_l1 time:nth-of-type(1){
        position:absolute;
        left:-0.5rem;
        top:0.16rem;
    }
    .add_p p:nth-of-type(6) .s_l1 time:nth-of-type(2){
        position:absolute;
        left:0.5rem;
        top:0.16rem ;
    }
    .add_p p:nth-of-type(6) .s_l1 time{
        display:block;
        height:0.25rem;
        width:0.25rem;
        border-radius:50%;
        border:1px solid #d2d1cf;
    }
    .add_p p:nth-of-type(6) .s_l span{
        font-size:0.17rem;
        color:#939393;
    }
    .add_p p{
        border-bottom:1px solid #9e9e9e;
    }
    .add_p p:nth-of-type(1){
    height:0.75rem;
    width:100%;
    line-height:0.75rem;
    text-align:center;
    color:#61704b;
    font-size:0.28rem;
    position:relative;
}
    .add_p p:nth-of-type(1) img{
        display:block;
        position:absolute;
        width:0.31rem;
        height:0.37rem;
        left:0.27rem;
        top:0.23rem;
    }
    .add_p p:nth-of-type(2){
        height:0.53rem;
        width:100%;
        display:flex;
        flex-direction: row;
    }
    .add_p p:nth-of-type(2) span{
        width:2.33rem;
        display:block;
        height:0.53rem;
        line-height:0.53rem;
        color:#3d3d3d;
        font-size:0.2rem;
        text-indent: 0.3rem;
    }
    .add_p p:nth-of-type(2) input{
        display:block;
        height:0.53rem;
        width:4.07rem;
        border:0;
        outline:none;
        font-size:0.18rem;
    }
    .add_p p:nth-of-type(3){
        height:0.53rem;
        width:100%;
        display:flex;
        flex-direction: row;
        overflow: hidden;
    }
    .add_p p:nth-of-type(3) span{
        width:2.33rem;
        display:block;
        height:0.6rem;
        line-height:0.6rem;
        color:#3d3d3d;
        text-indent: 0.3rem;
        font-size:0.2rem;
    }
    .add_p p:nth-of-type(3) input{
        display:block;
        height:0.6rem;
        width:4.07rem;
        border:0;
        outline:none;
        font-size:0.18rem;
    }
    .add_p p:nth-of-type(4){
        height:0.6rem;
        width:100%;
        display:flex;
        flex-direction: row;
        position:relative;
    }
    .add_p p:nth-of-type(4) span:nth-of-type(1){
        width:2.33rem;
        display:block;
        height:0.6rem;
        line-height:0.6rem;
        color:#3d3d3d;
        font-size:0.2rem;
        text-indent: 0.3rem;
    }
    .add_p p:nth-of-type(4) span:nth-of-type(2){
        display:block;
        height:0.6rem;
        width:4.07rem;
        line-height:0.6rem;
        font-size:0.18rem;
    }
    .add_p p:nth-of-type(4) img{
        display:block;
        position:absolute;
        height:0.37rem;
        width:0.3rem;
        right:0.2rem;
        top:0.17rem;
    }
    .add_p p:nth-of-type(5){
        height:0.6rem;
        width:100%;
        display:flex;
        flex-direction: row;
        overflow:hidden;
    }
    .add_p p:nth-of-type(5) span:nth-of-type(1){
        width:2.33rem;
        display:block;
        height:0.6rem;
        line-height:0.6rem;
        color:#3d3d3d;
        font-size:0.2rem;
        text-indent: 0.3rem;
    }
    .add_p p:nth-of-type(5) input{
        display:block;
        height:0.6rem;
        width:4.07rem;
        line-height:0.6rem;
        border: 0;
        outline: none;
        font-size:0.18rem;
    }
</style>